@import "../const";

.phoenix-panel {
  margin-top: 15px;
  &:first-child {
    margin-top: 0;
  }
  &.sub-panel {
    margin-top: 0;
    border: 1px solid @border-color-split;
    padding: @padding-xs @padding-md @padding-md;
    .panel-body {
      padding-top: @padding-sm;
    }
    .panel-title {
      padding-left: 0;
      border-left: none;
      font-size: 13px;
      line-height: 26px;
      > h1 {
        line-height: 26px;
        font-size: 13px;
        display: inline;
      }
    }
  }
  .panel-title {
    @title-height: 30px;
    @title-size: 15px;
    padding-left: 10px;
    border-left: 5px solid fadeout(@primary-color, 70%);
    line-height: @title-height;
    font-size: @title-size;
    .title-icon {
      margin-right: 8px;
    }
    .collapse {
      margin-left: 15px;
      color: #bfbfbf;
      font-size: 13px;
      .text-grey {
        color: @primary-gray;
      }
    }
    > h1 {
      line-height: @title-height;
      font-size: @title-size;
      font-weight: normal;
      margin: 0;
      padding: 0;
      display: inline;
    }
    .sub-title {
      line-height: 21px;
      font-size: 12px;
      margin-top: 7px;
      margin-left: 15px;
      .ant-checkbox-wrapper {
        font-size: 12px;
      }
      .ant-checkbox {
        font-size: 12px;
      }
      a.title-btn {
        .transitions(background-color);
        display: inline;
        margin-right: 7px;
        padding: 0 5px;
        background-color: lighten(@primary-color, 47%);
        color: @primary-color;
        i {
          margin-right: 3px;
        }
        &:hover {
          color: @primary-color;
          background-color: lighten(@primary-color, 39%);
        }
      }
    }
  }
  .panel-body {
    padding-top: 15px;
  }
}
